import Vue from 'vue';
import VueRouter from 'vue-router';
Vue.use(VueRouter)
//导入 getCookie 函数
import { getCookie } from '../utils/cookie.js'
// 导入store 
import store from '@/store'
// 根据角色获取路由数据接口
import { getPressApi } from '../http/http'
//解决vue-router在3.0版本以上重复点菜单报错的问题
const originalPush = VueRouter.prototype.push
VueRouter.prototype.push = function push(location) {
    return originalPush.call(this, location).catch(err => err)
}
// 引入Login组件
import Login from '@/views/Login.vue'
// 引入layout 组件
import Layout from '@/views/layout/Layout.vue'
// 引入home 组件
import Home from '@/views/home/Home.vue'

//公共权限
const routes = [
    {
        path: '/',
        redirect: '/layout'
    },
    {
        path: '/layout',
        name: 'Layout',
        component: Layout,
        children: [
            {
                path: '', component: Home, name: 'Home',
                meta: {
                    title: '首页',
                    icon: 'el-icon-attract'
                }
            }, {
                path: 'user',
                name: 'User',
                component: () => import('@/views/user/User.vue'),
                meta: {
                    title: '用户管理',
                    icon: 'el-icon-coordinate'
                }
            }, {
                path: 'msg',   // 信息管理功能
                name: 'Msg',
                component: () => import('@/views/msg/Msg.vue'),
                meta: {
                    title: '信息管理功能',
                    icon: 'el-icon-wallet'
                },
                children: [
                    {
                        path: 'mymsg',   //个人信息
                        name: 'Mymsg',
                        component: () => import('@/views/msg/Mymsg.vue'),
                        meta: {
                            title: '个人信息',
                            icon: 'el-icon-set-up'
                        },
                    }
                ]
            }
        ]
    },
    {
        path: '/login',
        name: 'Login',
        component: Login
    }
]
const router = new VueRouter({
    mode: 'history',
    // base: process.env.BASE_URL,
    routes
})

console.log(router);
//全局前置路由守卫
router.beforeEach((to, from, next) => {
    const token = getCookie('token');
    console.log(token);
    if (token) {
        // 说明已登录
        if (to.path === '/login') {
            // 如果当前路由为login,已存在token 直接跳转到首页
            next('/')
        } else {
            //用户不同-角色不同--权限不同（菜单）  
            //admin---管理员--导航菜单[审批管理，请假审批，我要请假] 
            //user---普通用户---导航菜单[我要请假]
            // console.log('查看', store.state.routes);  //切换用户  没有清空
            // if (to.path == '/layout') { //  切换用户,清空路由菜单
            //     store.commit('clearRoute')
            // }

            if (store.state.routes.length == 0) {
                // 第一次登录
                const role = localStorage.getItem('role') // store.state.role
                getPressApi({ role: role }).then(res => {
                    if (res.code == 200) {
                        //把数据转成路由对象  放在二级路由
                        res.data.forEach(item => {
                            // console.log('item', item);
                            routes[1].children.push({
                                path: item.path,
                                name: item.name,
                                meta: {
                                    title: item.meta.title,
                                    icon: item.meta.icon
                                },
                                component: () => import('@/views/' + item.name)
                            })
                        })
                        store.dispatch('setRoleAction', routes).then(() => {
                            // console.log('动态生成的路由1', routes);
                            //在addRoutes()之后第一次访问被添加的路由会白屏，这是因为刚刚addRoutes()就立刻访问被添加的路由，然而此时addRoutes()没有执行结束，因而找不到刚刚被添加的路由导致白屏。因此需要从新访问一次路由才行。
                            router.addRoutes(routes) //动态添加路由
                            next({ ...to, replace: true }) //解决动态添加路由白屏问题  bug

                        })

                    }
                })
            } else {
                next()  // 有路由菜单直接放行
            }
        }
    } else if (!token && to.path != '/login') {
        console.log('没有token');
        // 没有token  说明未登录，跳转到登录页
        next('/login');
    } else {
        next()
    }
})



export default router